import { message, Button } from 'antd';
import React, { useState } from 'react';
import { useDispatch, useSelector } from 'umi';

import type { Dispatch } from '@@/plugin-dva/connect';
import type { FC } from 'react';

import { namespace } from '@/models/global';
import EditModal from '@/pages/PersonCenter/CompanyInfo/EditModal';
import type { AllReduxState } from '@/pages/ProOrder';
import { updateInfo } from '@/services/orderManage';
import type { SaasUserInfo } from '@/types/User';
import { getErrorMsg } from '@/util/utils';

import styles from './index.less';

const CompanyInfo: FC = () => {
  // @ts-ignore
  const userInfo: SaasUserInfo = useSelector<AllReduxState>((state) => state.GLOBAL_DATA.userInfo);
  const dispatch = useDispatch<Dispatch>();
  const [isModalVisible, setModalVisible] = useState<boolean>(false);
  console.log(userInfo);
  const handleOk = (form: any) => {
    const formValue = form.getFieldsValue();
    form.validateFields().then(async () => {
      const payload = {
        ...formValue,
        saasUserId: userInfo?.id,
      };
      const res = await updateInfo(payload);
      if (res.code === 200) {
        dispatch({
          type: `${namespace}/getUserInfo`,
          callback() {},
        });
        message.success('企业信息更新成功');
        setModalVisible(false);
      } else {
        message.error(getErrorMsg(res));
      }
    });
  };
  const handleCancel = () => {
    setModalVisible(false);
  };
  const editInfo = () => {
   setModalVisible(true);
  };
  return (
    <>
      <EditModal isModalVisible={isModalVisible} handleOk={handleOk} handleCancel={handleCancel}/>
      <div className={styles.content}>
        <div className={styles.title}>企业信息</div>
        <div className={styles.centerContent}>
          <div className={styles.userInfo}>
            <div>
              <div className={styles.infoContent}>
                <span>
                  <span>企业名称：</span> <span>{userInfo?.companyName}</span>
                </span>
                <span />{' '}
              </div>
              <div className={styles.infoContent}>
                <span>
                  <span>手机号：</span> <span>{userInfo?.companyContactPhone}</span>
                </span>
                <span />{' '}
              </div>
              <div className={styles.infoContent}>
                <span>
                  <span>联系人：</span> <span>{userInfo?.companyContact}</span>
                </span>
                <span />{' '}
              </div>
              {/*<div className={styles.infoContent}>*/}
              {/*  <span>*/}
              {/*    <span>社区号：</span> <span>{userInfo?.communityId===0 ? '' : userInfo?.communityId}</span>*/}
              {/*  </span>*/}
              {/*  <span />{' '}*/}
              {/*</div>*/}
              <div className={styles.infoContent}>
                <span>
                  <span>地址：</span> <span>{userInfo?.companyAddress}</span>
                </span>
                <span />{' '}
              </div>
              <div className={styles.infoContent}>
                <span>
                  <span>所属行业：</span> <span>{userInfo?.companyIndustry}</span>
                </span>
                <span />{' '}
              </div>
              <div className={styles.infoContent}>
                <span>
                  <span>公司员工数：</span> <span>{userInfo?.companyStuffNumber}</span>
                </span>
                <span />{' '}
              </div>
              <div className={styles.infoContent}>
                <span>
                  <span>社会统一信用代码：</span> <span>{userInfo?.uscCode}</span>
                </span>
                <span />{' '}
              </div>
            </div>
          </div>
          <div className={styles.editInfo}><Button onClick={editInfo} type={'primary'}>编辑信息</Button></div>
        </div>
      </div>

    </>
  );
};
export default CompanyInfo;
